<?php
session_start();

if (isset($_SESSION['nip'], $_SESSION['username'])) {
    header("Location: index.php?page=main");
}
?>

<?php
include '_header.php';
?>

<script language="javascript">
    $(document).ready(function()
    {
        $("#login_form").submit(function()
        {
            if (!$('#nip').val()) {
                $("#msgbox").removeClass().addClass('messagebox').addClass('messageboxerror').text('NIP can\'t empty!').fadeIn(500).fadeOut(2000);
                $('#nip').addClass('error');
                $('#nip').focus();
            } else if (!$('#password').val()) {
                $("#msgbox").removeClass().addClass('messagebox').addClass('messageboxerror').text('Password can\'t empty!').fadeIn(500).fadeOut(2000);
                $('#password').addClass('error');
                $('#password').focus();
            } else {
                $("#msgbox").removeClass().addClass('messagebox').text('Validating...').fadeIn(1000);

                $.post("ws/dosen_services.php?action=login", {nip: $('#nip').val(), password: $('#password').val(), rand: Math.random()}, function(data)
                {
                    var json = $.parseJSON(data);
                    $.each(json, function() {
                        status = this['Status'];
                    });
                    if (status === 'Success')
                    {
                        $("#msgbox").fadeTo(200, 0.1, function()
                        {
                            $(this).html('Logging in...').addClass('messageboxok').fadeTo(900, 1, function()
                            {
                                document.location = 'index.php?page=main';
                            });
                        });
                    }
                    else
                    {
                        $("#msgbox").addClass('messageboxerror').text(status).fadeOut(3000);
                        $('#nip').focus();
                    }

                });
            }
            return false;
        });

        $('#nip').keypress(function() {
            $('#nip').removeClass('error');
        });
        $('#nip').focusout(function() {
            $('#nip').removeClass('error');
        });
        $('#password').keypress(function() {
            $('#password').removeClass('error');
        });
        $('#password').focusout(function() {
            $('#password').removeClass('error');
        });
    });
</script>
<style type="text/css">
    body {
        font-family:Verdana, Arial, Helvetica, sans-serif;
        font-size:11px;
    }

</style>

<div class="login_box">
    <div align="center">
        <img id="logo" src="asset/img/e-learning.png" />
    </div>

    <h1 align="center">Login Administrator</h1>
    <br/>
    <form id="login_form" method="post" action="">
		<div align="center">
        <table width="200" border="0" cellspacing="0" cellpadding="0">
            <tr>
                <td>NIP</td>
                <td>&nbsp;&nbsp;</td> 
                <td><input id="nip" name="nip" type="text" size="25"></td>
            </tr>
            <tr>
                <td>Password</td>
                <td>&nbsp;&nbsp;</td>
                <td><input id="password" name="password" type="password" size="25"></td>
            </tr>
            <tr>
                <td colspan="3" align="right"><input type="submit" value="Login" class="button"></td>
            </tr>
        </table>
		</div>
    </form>
    <br/>
    <div align="center">
        <span id="msgbox" style="display:none;"></span>
    </div>
</div>

</body>
</html>
